Skip to content

Conversation

@bobbyonmagic
Copy link
Collaborator

Summary

Implements issue #662 - Add Horizontal vs Vertical Scaling Interactive Simulator

Changes

New Files

  • components/games/scaling-simulator.tsx - Main game component
  • app/games/scaling-simulator/page.tsx - Game page with educational content

Modified Files

  • lib/games.ts - Added scaling simulator to games list

Features

Scaling Options

  • Vertical Scaling: Upgrade CPU (2-16 cores), RAM (4-64GB), disk (HDD/SSD/NVMe)
  • Horizontal Scaling: Add/remove servers with load balancer requirement
  • Auto-Scaling: Configurable CPU threshold, min/max instances

Scenarios

  1. Gradual Growth (Easy) - Linear traffic increase 100→500 req/s
  2. Sudden Spike (Medium) - Instant jump from 100 to 1000 req/s
  3. Variable Load (Hard) - Unpredictable patterns: 50→500→100→800
  4. Black Friday (Expert) - Massive spike to 5000 req/s with tight budget

Metrics Dashboard

  • Real-time traffic monitoring
  • Response time tracking with targets
  • Uptime calculation (target >95%)
  • Budget management with cost breakdown
  • Traffic history visualization

Educational Content

  • Built-in guide explaining vertical vs horizontal scaling
  • Real-world application examples (AWS, Kubernetes)
  • Best practices for scaling strategies

Closes #662

Implements issue #662 - Interactive simulator for learning scaling strategies

- Add scaling-simulator component with comprehensive features:
  - Vertical scaling: Upgrade CPU, RAM, disk, and network
  - Horizontal scaling: Add/remove servers with load balancer
  - Auto-scaling: Configurable thresholds and instance limits
  - 4 difficulty scenarios: Gradual Growth, Sudden Spike, Variable Load, Black Friday
  - Real-time metrics: Traffic, response time, uptime, cost
  - Budget constraints with realistic AWS-like pricing
  - Educational guide panel explaining scaling concepts

- Add game page with educational content and social sharing
- Register game in lib/games.ts with proper metadata

Closes #662
@cloudflare-workers-and-pages
Copy link

cloudflare-workers-and-pages bot commented Jan 17, 2026

Deploying devops-daily with  Cloudflare Pages  Cloudflare Pages

Latest commit: 38f0ebf
Status: ✅  Deploy successful!
Preview URL: https://9c8248e1.devops-daily.pages.dev
Branch Preview URL: https://feat-scaling-simulator.devops-daily.pages.dev

View logs

- Limit manual server additions to maxInstances (10 by default)
- Disable 'Add Server' button when at max capacity
- Show 'Max 10' badge when limit reached instead of price
- Shows 'Remove Server' button when more than 1 server exists
- Styled with red border/hover to indicate removal action
- Shows -$20/mo badge to indicate cost savings
- Removes the most recently added server
- When auto-scaling is enabled, system now scales up to meet
  minInstances requirement, not just when CPU threshold is exceeded
- This ensures if minInstances is set to 5 with only 2 active servers,
  the system will automatically add servers to reach the minimum
- Added separate useEffect to monitor minInstances changes
- Servers are added automatically (one at a time) when:
  - Auto-scaling is enabled
  - Load balancer is active
  - Current server count < minInstances
- Works even when simulation is paused
- Auto-scaling now scales down when server count exceeds new minInstances
- Removes servers one at a time with 500ms delay
- Still maintains at least 1 server
The second useEffect was unconditionally scaling down servers when
count exceeded minInstances, which conflicted with the CPU-based
auto-scaling in the game loop. Now the useEffect only handles
scaling UP to meet minimum requirements, while CPU-based scale-up
and scale-down remain controlled by the game loop thresholds.
- Calculate avgLoad synchronously before state update (was using stale data)
- Reduce scaleUpDelay from 30s to 5s for faster response to spikes
- The CPU threshold check now uses current tick's load, not previous tick
Displays all component prices (CPU, RAM, disk, network) in a clear
grid layout so users understand costs before upgrading.
@bobbyonmagic bobbyonmagic merged commit 6d242ce into main Jan 17, 2026
2 checks passed
@bobbyonmagic bobbyonmagic deleted the feat/scaling-simulator branch January 17, 2026 20:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add Horizontal vs Vertical Scaling Interactive Simulator

2 participants